import { Button } from 'antd';
import { Component } from 'react';

class Child extends Component {
    state = {
        msg:"Hello Parent"
    }
    render() {

        return (
            <div className='border-dashed border-2 p-2 border-blue-500 mt-4'>
                <div >获取到父级count:{this.props.count}</div>
                <Button onClick={()=>{this.props.getMsg(this.state.msg)}}>给父组件传消息</Button>
            </div>
        )
    }
}
class ClassPage extends Component {

    state = {
        count: 0,
        childMsg:""
    }

    handleClick = () => {
        this.setState({ count: ++this.state.count })
    }
    getMsg = (msg) => {
        console.log("msg",msg)
        this.setState({ childMsg: msg })
    }
    render() {
        return (
            <div className='border-dashed border-2 p-2 border-blue-300'>
                <Button type="primary" onClick={this.handleClick}>Click me + 1：
                {this.state.count}
                </Button>
                {this.state.childMsg}
                <Child count={this.state.count} getMsg={this.getMsg} ></Child>
            </div>
        )
    }

}

function App() {
    return (
        <ClassPage />
    )
}
export default App;